<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>游戏案例</title>
</head>

<body>
    <link href="https://cdn.bootcdn.net/ajax/libs/animate.css/4.1.1/animate.min.css" rel="stylesheet">
    <script type="text/javascript" src="http://www.jeendo.com/script/wow/wow.min2.js"></script>
    <div class="web">
        <header>
            <div class="logo wow animate__rubberBand animate__infinite">
                <img src="../img/logo.png" alt="">
            </div>
            <div class="url">
                <a href="./index.html">
                    <div class="title">首页
                        <p>home</p>
                    </div>
                </a>
                <a href="./list.html">
                    <div class="title">游戏
                        <p>game</p>
                    </div>
                </a>
                <a href="./case.html">
                    <div class="title">案例
                        <p>Case</p>
                    </div>
                </a>
                <a href="./user.html">
                    <div class="title">关于我们
                        <p>About us</p>
                    </div>
                </a>
                <a href="./list2.html">
                    <div class="weixin">
                        <img src="../img/sy-wx.png" alt="">
                    </div>
                </a>
            </div>
        </header>

        <main>

            <div class="bigBox wow animate__fadeInDown">
                <div class="centont">
                    <div class="left">
                        <img src="../img/c1.png" alt="">
                    </div>
                    <div class="right">
                        <div class="top">
                            <div class="title">
                                <div class="line"></div>
                                <p>宝石迷阵</p>
                                <div>《宝石迷阵》与暴司时候发行的游的的戏《星际争霸》一样，是一款成功的即时战略游戏。 游戏时战略游戏所要素：建设基地和指挥指挥战斗。游戏的操作方式也，秉承了星霸优点， 并对星际争霸中一些繁琐的操作进行了简化。
                                </div>

                                <a href="#">收藏</a>
                                <a href="#">制作游戏</a>
                                <a href="#">购买</a>
                            </div>

                        </div>
                        <div class="bottom">
                            <div class="item">
                                <div class="ic">
                                    <i class="iconfont icon-shijian"></i>
                                </div>
                                <p>时间</p>
                                <div class="time"> 2014-07-09</div>
                            </div>

                            <div class="item">
                                <div class="ic">
                                    <i class="iconfont  icon-jiage"></i>
                                </div>
                                <p>价格</p>
                                <div class="time"> 2014-07-09</div>
                            </div>

                            <div class="item">
                                <div class="ic">
                                    <i class="iconfont icon-xingxing1"></i>
                                </div>
                                <p>次数</p>
                                <div class="time"> 2014-07-09</div>
                            </div>
                            <div class="item">
                                <div class="ic">
                                    <i class="iconfont icon-wenjianjia"></i>
                                </div>
                                <p>时间</p>
                                <div class="time"> 2014-07-09</div>
                            </div>
                        </div>
                    </div>

                </div>
                <div class="bg">
                    <img src="../img/bg.png" alt="">
                </div>
            </div>


            <section>
                <div class="title">
                    <div class="line"></div>
                    <p>使用方法</p>
                    <span>USE METHODS</span>


                </div>
                <div class="box">
                    <div class="item wow animate__lightSpeedInLeft">
                        <div class="imgBox b1">
                            <img src="../img/Brand.png" alt="">
                        </div>
                        <b>STEP ONE</b>
                        <span>选择一个游戏，换图</span>
                    </div>

                    <div class="right">
                        <img src="../img/6.png" alt="">
                    </div>

                    <div class="item big wow animate__shakeX">
                        <div class="imgBox b2">
                            <img src="../img/icon2.png" alt="">
                        </div>
                        <b>THE SECOND STEP</b>
                        <span>选择一个游戏，换图</span>
                    </div>
                    <div class="right">
                        <img src="../img/6.png" alt="">
                    </div>
                    <div class="item wow animate__lightSpeedInRight">
                        <div class="imgBox b3">
                            <img src="../img/icon3.png" alt="">
                        </div>
                        <b>THE THIRD STEP</b>
                        <span>选择一个游戏，换图</span>
                    </div>
                </div>

            </section>
        </main>

        <footer>
            <div class="left"><img src="../img/f1.png" alt=""></div>
            <div class="text">COPYRIGHT © 2014 PANGTANG. ALL RIGHTS RESERVED. 版权所有</div>
            <div class="right"><img src="../img/f2.png" alt=""></div>
        </footer>
    </div>
</body>

</html>